//
//  ImageTextButton.swift
//  SwiftUIButton
//
//  Created by 李煜 on 2024/7/30.
//

import SwiftUI

struct ImageTextButton: View {
    var body: some View {
        Button(action: {}, label: {
            Image(systemName: "trash")
                .font(.largeTitle)
                .foregroundColor(.red)
        })
        // 带背景的button
        Button(action: {}, label: {
            Image(systemName: "trash")
                .padding()
                .background(.red)
                // 裁剪成圆
                .clipShape(Circle())
                .font(.largeTitle)
                .foregroundColor(.white)
        })

        // 图片文字的button
        Button(action: {}, label: {
            HStack {
                Image(systemName: "trash")
                    .font(.title)
                Text("Delete")
                    .fontWeight(.semibold)
                    .font(.title)
            }
            .padding()
            .background(.red)
            .cornerRadius(40) //   或者使用.clipShape(.capsule)
            .foregroundColor(.white)
        })
        // 使用标签替代HStack
        // label有使图片和文字并排的功能

        Button(action: {}, label: {
            Label(
                title: {
                    Text("Delete")
                        .fontWeight(.semibold)
                        .font(.title)
                },
                icon: { Image(systemName: "trash")
                    .font(.title)
                }
            )
            .padding()
            .background(.red)
            .clipShape(.capsule)//使用clipShape制作圆角按钮
            .foregroundColor(.white)
        })
    }
}

#Preview {
    ImageTextButton()
}
